import React, {Component} from 'react'
import PropTypes from 'prop-types'
import link from '../containers/Link'

export default class Picker extends Component {
    render() {
        const {value, onChange, options} = this.props

        return (

            <span>
                <link filter="all">
                     All
                </link>
                <h1>{value}</h1>
                <select onChange={e => onChange(e.target.value)}
                        value={value}>
                  {options.map(option =>
                      <option value={option} key={option}>
                          {option}
                      </option>)
                  }
                </select>
            </span>
        )
    }
}

Picker.propTypes = {
    options: PropTypes.arrayOf(
        PropTypes.string.isRequired
    ).isRequired,
    value: PropTypes.string.isRequired,
    onChange: PropTypes.func.isRequired
}